<template>
  <div>
    <el-dialog
      :close-on-click-modal="false"
      v-model="visibleDialog"
      :title="props.title"
      :destroy-on-close="true"
      :width="!props.isReadonly ? '1100px' : '1100px'"
      :align-center="true"
      draggable
      @close="closeDialog"
      style="min-width: 1100px"
      class="maxhDialog"
    >
      <el-form
        ref="formRef"
        :model="formData"
        :rules="rules"
        label-width="120"
        v-show="!props.isReadonly"
        style="width: 99%"
      >
        <el-row>
          <!--          <el-col :span="8" v-if="props.assetKind != 3">-->
          <!-- <el-form-item
              v-if="props.assetKind == 3"
              label="物料编号"
              prop="standardCode"
            >
              <el-input
                v-if="!props.isReadonly"
                v-model="formData.standardCode"
                placeholder="请选择物料编号"
                clearable
                readonly
                class="moldEnterInspect"
              >
                <template #append>
                  <div @click="openMaterialDialog">选择</div></template
                >
              </el-input>
              <span v-else>{{ formData.standardCode }}</span>
            </el-form-item> -->

          <!--            <el-form-item label="作业编号" prop="standardCode">-->
          <!--              <el-input-->
          <!--                v-model="formData.standardCode"-->
          <!--                placeholder="请输入作业编号"-->
          <!--                clearable-->
          <!--              />-->
          <!--            </el-form-item>-->
          <!--          </el-col>-->
          <el-col :span="8">
            <el-form-item label="标准名称" prop="standardName">
              <el-input
                v-model="formData.standardName"
                placeholder="请输入标准名称"
                clearable
              />
            </el-form-item>
          </el-col>
          <!-- <el-col :span="8">
            <el-form-item label="作业类型" prop="sopTypeId">
              <el-select
                v-model="formData.sopTypeId"
                placeholder="请选择作业类型"
                :disabled="sopType !== null"
                clearable
                style="width: 100%"
              >
                <el-option
                  v-for="item in typeList"
                  :key="item.id"
                  :label="item.sopTypeName"
                  :value="item.id"
                />
              </el-select>
            </el-form-item>
          </el-col> -->
          <el-col :span="8">
            <el-form-item label="标准类型" prop="sopTypeId">
              <el-select
                v-model="formData.sopTypeId"
                placeholder="请选择标准类型"
                :disabled="!(sopType !== null)"
                clearable
                style="width: 100%"
              >
                <el-option
                  v-for="item in typeList"
                  :key="item.id"
                  :label="item.sopTypeName"
                  :value="item.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="设备种类" prop="equipTypeId">
              <el-tree-select
                v-model="formData.equipTypeId"
                node-key="id"
                :check-strictly="true"
                :props="{
                  children: 'nodes',
                  label: 'assetTypeName',
                }"
                placeholder="请选择设备种类"
                :data="deviceList"
                filterable
                clearable
                style="width: 100%"
                @change="handleEquipTypeChange"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="作业区域" prop="locationId">
              <el-tree-select
                placeholder="请输入作业区域"
                filterable
                v-if="!props.isReadonly"
                v-model="formData.locationId"
                :data="locationInfoTree"
                node-key="id"
                clearable
                :props="{ label: 'locationName', children: 'nodes' }"
                check-strictly
                style="width: 100%"
                @node-click="changeLocation"
                :render-after-expand="false"
                @change="handelLocation"
              />

              <span v-else>{{ formData.locationName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="标准周期" prop="standardCycle">
              <el-row>
                <el-col :span="15">
                  <el-input
                    v-model="formData.standardCycle"
                    placeholder="请输入"
                    clearable
                  />
                </el-col>
                <el-col :span="1" />
                <el-col :span="8">
                  <el-select
                    v-model="formData.standardCycleType"
                    placeholder="请选择"
                  >
                    <el-option
                      v-for="item in dictionaryStore.filterDictList(
                        'StandardCycleType'
                      )"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    />
                  </el-select>
                </el-col>
              </el-row>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="标准人员类型" prop="standardPersonnel">
              <el-select
                style="width: 100%"
                v-model="formData.standardPersonnel"
                placeholder="请选择标准人员类型"
                clearable
              >
                <el-option
                  v-for="item in dictionaryStore.filterDictList(
                    'StandardPersonnel'
                  )"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8" v-if="assetKind != 1">
            <el-form-item label="制造商">
              <el-select
                v-model="formData.makerId"
                placeholder="请选择制造商"
                style="width: 300px"
                clearable
                @change="(e) => handleMakerChange(e, 'row')"
              >
                <el-option
                  v-for="item in makerList"
                  :key="`${item.id}`"
                  :label="`${item.makerCode}-${item.makerName}`"
                  :value="`${item.id}`"
                />
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="8" v-if="assetKind != 1">
            <el-form-item label="品牌型号">
              <el-select
                v-model="formData.assetModelId"
                placeholder="请选择品牌型号"
                style="width: 300px"
                clearable
                @change="handelBrandModelNo"
              >
                <el-option
                  v-for="item in brandModelList"
                  :key="`${item.id}`"
                  :label="`${item.brandName}-${item.modelNo}`"
                  :value="`${item.id}`"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8" v-if="assetKind != 1">
            <el-form-item label="编制时间" prop="standardCompileTime">
              <el-date-picker
                v-model="formData.standardCompileTime"
                type="datetime"
                value-format="YYYY-MM-DD HH:mm:ss"
                placeholder="请输入编制时间"
                clearable
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8" v-if="assetKind != 1">
            <el-form-item label="编制人" prop="standardCompilePersonnel">
              <el-input
                v-model="formData.standardCompilePersonnel"
                placeholder="请输入编制人"
                clearable
              />
            </el-form-item>
          </el-col>
          <el-col :span="8" v-if="assetKind != 1">
            <el-form-item label="审核时间" prop="standardExamineTime">
              <el-date-picker
                v-model="formData.standardExamineTime"
                type="datetime"
                value-format="YYYY-MM-DD HH:mm:ss"
                placeholder="请输入审核时间"
                clearable
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8" v-if="assetKind != 1">
            <el-form-item label="审核人" prop="standardExaminePersonnel">
              <el-input
                v-model="formData.standardExaminePersonnel"
                placeholder="请输入审核人"
                clearable
              />
            </el-form-item>
          </el-col>
          <el-col :span="8" v-if="assetKind != 1">
            <el-form-item label="批准时间" prop="standardRatifyTime">
              <el-date-picker
                v-model="formData.standardRatifyTime"
                type="datetime"
                value-format="YYYY-MM-DD HH:mm:ss"
                placeholder="请输入批准时间"
                clearable
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8" v-if="assetKind != 1">
            <el-form-item label="批准人" prop="standardRatifyPersonnel">
              <el-input
                v-model="formData.standardRatifyPersonnel"
                placeholder="请输入批准人"
                clearable
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否启用" prop="enabled">
              <el-radio-group v-model="formData.enabled">
                <el-radio :label="1">启用</el-radio>
                <el-radio :label="0">停用</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="16">
            <el-form-item label="备注" prop="remarks">
              <el-input
                type="textarea"
                v-model="formData.remarks"
                placeholder="请输入备注"
                show-word-limit
                :maxlength="250"
                :autosize="{ minRows: 2, maxRows: 3 }"
                clearable
              />
            </el-form-item>
          </el-col>
        </el-row>

        <el-tabs type="border-card">
          <el-tab-pane label="作业指导书">
            <CommonUploadFile
              :isRead="props.isReadonly"
              :files="formData.images"
              @update-files="updateFormFiles"
            />
          </el-tab-pane>
        </el-tabs>
      </el-form>

      <el-descriptions
        v-show="props.isReadonly"
        title=""
        :column="3"
        size="large"
        border
        style="width: 99%; max-height: 70vh; overflow-y: auto"
      >
        <!--        <el-descriptions-item>-->
        <!--          <template #label>-->
        <!--            <div class="cell-item" v-if="props.assetKind == 3">物料编号</div>-->
        <!--            <div class="cell-item" v-else>作业编号</div>-->
        <!--          </template>-->
        <!--          {{ formData.standardCode || "" }}-->
        <!--        </el-descriptions-item>-->
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">标准名称</div>
          </template>
          {{ formData.standardName || "" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">标准类型</div>
          </template>
          {{ formData.sopTypeName || "" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">设备种类</div>
          </template>
          {{ formData.assetTypeName || "" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">作业区域</div>
          </template>
          {{ formData.locationName || "" }}
        </el-descriptions-item>

        <el-descriptions-item>
          <template #label>
            <div class="cell-item">标准周期</div>
          </template>
          {{ formData.standardCycle || "" }}
          {{
            dictionaryStore.filterDictName(
              "StandardCycleType",
              formData.standardCycleType
            )
          }}
        </el-descriptions-item>

        <el-descriptions-item>
          <template #label>
            <div class="cell-item">标准人员类型</div>
          </template>
          {{
            dictionaryStore.filterDictName(
              "StandardPersonnel",
              formData.standardPersonnel
            )
          }}
        </el-descriptions-item>

        <el-descriptions-item v-if="assetKind != 1">
          <template #label>
            <div class="cell-item">制造商</div>
          </template>
          <span v-if="formData.makerCode || formData.makerName"
            >{{ formData.makerCode }} - {{ formData.makerName }}</span
          >
          <span v-else></span>
        </el-descriptions-item>

        <el-descriptions-item v-if="assetKind != 1">
          <template #label>
            <div class="cell-item">品牌型号</div>
          </template>
          <span v-if="formData.brandName || formData.modelNo"
            >{{ formData.brandName }} - {{ formData.modelNo }}</span
          >
          <span v-else></span>
        </el-descriptions-item>

        <el-descriptions-item v-if="assetKind != 1">
          <template #label>
            <div class="cell-item">编制时间</div>
          </template>
          {{ formData.standardCompileTime || "" }}
        </el-descriptions-item>

        <el-descriptions-item v-if="assetKind != 1">
          <template #label>
            <div class="cell-item">编制人</div>
          </template>
          {{ formData.standardCompilePersonnel || "" }}
        </el-descriptions-item>

        <el-descriptions-item v-if="assetKind != 1">
          <template #label>
            <div class="cell-item">审核时间</div>
          </template>
          {{ formData.standardExamineTime || "" }}
        </el-descriptions-item>

        <el-descriptions-item v-if="assetKind != 1">
          <template #label>
            <div class="cell-item">审核人</div>
          </template>
          {{ formData.standardExaminePersonnel || "" }}
        </el-descriptions-item>

        <el-descriptions-item v-if="assetKind != 1">
          <template #label>
            <div class="cell-item">批准时间</div>
          </template>
          {{ formData.standardRatifyTime || "" }}
        </el-descriptions-item>

        <el-descriptions-item v-if="assetKind != 1">
          <template #label>
            <div class="cell-item">批准人</div>
          </template>
          {{ formData.standardRatifyPersonnel || "" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">是否启用</div>
          </template>
          <el-tag v-show="formData.enabled === 1" type="">启用</el-tag>
          <el-tag v-show="formData.enabled !== 1" type="info">停用</el-tag>
        </el-descriptions-item>
        <el-descriptions-item :span="3">
          <template #label>
            <div class="cell-item">备注</div>
          </template>
          <div style="width: 100%; word-break: break-all">
            {{ formData.remarks || "暂无备注" }}
          </div>
        </el-descriptions-item>
        <el-descriptions-item :span="3">
          <template #label>
            <div class="cell-item">作业指导书</div>
          </template>
          <div v-if="formData.images && formData.images.length">
            <CommonUploadFile
              :showText="false"
              :isRead="props.isReadonly"
              :files="formData.images"
              @update-files="updateFormFiles"
            />
          </div>
          <div v-else>无</div>
        </el-descriptions-item>
      </el-descriptions>

      <template #footer>
        <div class="dialog-footer">
          <el-button
            v-if="!props.isReadonly"
            type="primary"
            :loading="loading"
            @click="handleSubmit"
            >确 定</el-button
          >
          <el-button @click="closeDialog">取 消</el-button>
        </div>
      </template>
    </el-dialog>
    <SelectMaterialDialog
      v-model:visible="materialSelect.visible"
      :data="materialSelect.data"
      :isMultiple="false"
      :materialType="9"
      @echo-info="getMaterialSelect"
    />
    <!-- <SelectMaterialDialog
      v-model:visible="materialSelect.visible"
      :data="materialSelect.data"
      :isMultiple="false"
      @echo-info="getMaterialSelect"
    /> -->
  </div>
</template>

<script setup lang="ts">
import request from "@/utils/request";
import { useDictStoreHook } from "@/store/modules/dictionary"; // 引入
import {
  getStandardTypesApi,
  getStandardDevicesApi,
  getMakerListApi,
  getBrandModelListApi,
} from "@/utils/commonData";
import {
  validateNumberCanNot,
  validateNumberCanNot1,
} from "@/utils/commonHooks";

const dictionaryStore = useDictStoreHook();

defineOptions({
  name: "CommonWorkStandardEdit",
  inheritAttrs: false,
});

const emit = defineEmits(["reset-table", "change-visible"]);

const props = defineProps({
  visible: {
    type: Boolean,
    default: () => {
      return false;
    },
  },
  title: {
    type: String,
    default: () => {
      return "";
    },
  },
  data: {
    type: Object,
    default: () => {
      return {};
    },
  },
  isReadonly: {
    type: Boolean,
    default: () => {
      return false;
    },
  },
  assetKind: {
    type: Number,
    default: null,
  },
  sopTypeCode: {
    type: String,
    default: "",
  },
  taskKind: {
    type: String,
    default: null,
  },
});

const visibleDialog = ref(false);
const formRef = ref(ElForm);
watch(
  () => props.visible,
  (newVal: boolean) => {
    visibleDialog.value = newVal;
    setTimeout(() => {
      formRef.value && formRef.value.clearValidate();
    }, 50);
  }
);
function validateNumberCanNot1(
  rule: any,
  value: any,
  callback: (a?: any) => {}
) {
  const value1 = value.toString();
  if (value1 === "" || value1 === null) {
    callback();
  } else {
    if (isNaN(parseFloat(value1)) && isFinite(value1)) {
      callback(new Error("请输入数字"));
    } else if (!/^[+-]?\d*(\.\d*)?(e[+-]?\d+)?$/.test(value1)) {
      callback(new Error("请输入数字"));
    } else if (value1.indexOf(".") !== -1) {
      callback(new Error("不能为小数"));
    } else if (Number(value1) < 0) {
      callback(new Error("数字不能小于0"));
    } else {
      callback();
    }
  }
}

const rules = reactive(<any>{
  remarks: [
    { message: "请输入备注", trigger: "blur" },
    { max: 255, message: "不能超过255个字符", trigger: "blur" },
  ],
  enabled: [{ required: true, message: "请选择是否启用", trigger: "change" }],
  standardCode: [
    { required: true, message: "请输入标准编号", trigger: "blur" },
    { max: 32, message: "不能超过32个字符", trigger: "blur" },
  ],
  standardName: [
    { required: true, message: "请输入标准名称", trigger: "blur" },
    { min: 1, max: 50, message: "不能超过50个字符", trigger: "blur" },
  ],
  sopTypeId: [{ required: true, message: "请选择标准类型", trigger: "change" }],
  equipTypeId: [
    // { required: true, message: "请选择设备种类", trigger: "change" },
  ],
  standardCycle: [
    {
      required: false,
      message: "请输入周期",
      trigger: "blur",
    },
    {
      validator: validateNumberCanNot1,
      trigger: "blur",
    },
  ],
  standardPersonnel: [
    { required: true, message: "请选择标准人员类型", trigger: "change" },
  ],
  standardCompilePersonnel: [
    { min: 1, max: 32, message: "不能超过32个字符", trigger: "blur" },
  ],
  standardExaminePersonnel: [
    { min: 1, max: 32, message: "不能超过32个字符", trigger: "blur" },
  ],
  standardRatifyPersonnel: [
    { min: 1, max: 32, message: "不能超过32个字符", trigger: "blur" },
  ],
});

let formData = reactive({
  id: "",
  version: "",
  remarks: "",
  standardCode: "",
  standardName: "",
  sopTypeId: "",
  standardCategory: "",
  assetKind: props.assetKind,
  taskKind: props.taskKind,
  sopTypeCode: props.sopTypeCode,
  equipTypeId: "",
  locationId: "",
  locationName: "",
  equipTypeName: "",
  standardCycle: "",
  standardCycleType: "1",
  standardPersonnel: "",
  standardCompileTime: "",
  standardCompilePersonnel: "",
  standardExamineTime: "",
  standardExaminePersonnel: "",
  standardRatifyTime: "",
  standardRatifyPersonnel: "",
  createTime: "",
  createdUserId: "",
  createdUserName: "",
  lastUpdateTime: "",
  lastUpdatedUserId: "",
  lastUpdatedUserName: "",
  enabled: 1,
  deleted: "",
  images: [],
  sopTypeName: "",
  assetTypeName: "",
  brandId: "",
  brandName: "",
  makerId: "",
  makerName: "",
  makerCode: "",
  modelNo: "",
  assetModelId: "",
});

watch(
  () => props.data,
  (newVal: any) => {
    formData.id = "";

    if (newVal?.id) {
      const {
        id,
        version,
        remarks,
        standardCode,
        standardName,
        sopTypeId,
        standardCategory,
        assetKind,
        taskKind,
        sopTypeCode,
        equipTypeId,
        locationId,
        locationName,
        brandId,
        brandName,
        makerId,
        makerName,
        makerCode,
        modelNo,
        assetModelId,
        standardCycle,
        standardCycleType,
        standardPersonnel,
        standardCompileTime,
        standardCompilePersonnel,
        standardExamineTime,
        standardExaminePersonnel,
        standardRatifyTime,
        standardRatifyPersonnel,
        createTime,
        createdUserId,
        createdUserName,
        lastUpdateTime,
        lastUpdatedUserId,
        lastUpdatedUserName,
        enabled,
        deleted,
        images,
        sopTypeName,
        assetTypeName,
      } = newVal;
      Object.assign(formData, {
        id,
        version,
        remarks,
        standardCode,
        standardName,
        sopTypeId,
        standardCategory,
        assetKind,
        taskKind,
        sopTypeCode,
        equipTypeId,
        locationId,
        locationName,
        brandId,
        brandName,
        makerId,
        makerName,
        makerCode,
        modelNo,
        assetModelId,
        standardCycle,
        standardCycleType,
        standardPersonnel,
        standardCompileTime,
        standardCompilePersonnel,
        standardExamineTime,
        standardExaminePersonnel,
        standardRatifyTime,
        standardRatifyPersonnel,
        createTime,
        createdUserId,
        createdUserName,
        lastUpdateTime,
        lastUpdatedUserId,
        lastUpdatedUserName,
        enabled,
        deleted,
        images: images ?? [],
        sopTypeName,
        assetTypeName,
      });
      handleMakerChange(makerId, "");
    } else {
      formData.images = [];
      formData.enabled = 1;
      formData.assetKind = props.assetKind;
      formData.taskKind = props.taskKind;
    }
  }
);

/** 关闭表单弹窗 */
function closeDialog() {
  visibleDialog.value = false;
  emit("change-visible", false);
  resetForm();
}

/** 重置表单 */
function resetForm() {
  if (formRef.value) {
    formRef.value.resetFields();
    formRef.value.clearValidate();
  }
  formData.id = "";
  formData.version = "";
  formData.remarks = "";
  formData.standardCode = "";
  formData.standardName = "";
  if (!props.sopTypeCode) formData.sopTypeId = "";
  formData.standardCategory = "";
  formData.assetKind = props.assetKind;
  formData.taskKind = props.taskKind;
  formData.equipTypeId = "";
  formData.locationId = "";
  formData.locationName = "";
  formData.brandId = "";
  formData.brandName = "";
  formData.makerId = "";
  formData.makerName = "";
  formData.makerCode = "";
  formData.modelNo = "";
  formData.assetModelId = "";
  formData.standardCycle = "";
  formData.standardCycleType = "1";
  formData.standardPersonnel = "";
  formData.standardCompileTime = "";
  formData.standardCompilePersonnel = "";
  formData.standardExamineTime = "";
  formData.standardExaminePersonnel = "";
  formData.standardRatifyTime = "";
  formData.standardRatifyPersonnel = "";
  formData.createTime = "";
  formData.createdUserId = "";
  formData.createdUserName = "";
  formData.lastUpdateTime = "";
  formData.lastUpdatedUserId = "";
  formData.lastUpdatedUserName = "";
  formData.enabled = 1;
  formData.deleted = "";
  formData.sopTypeName = "";
  formData.assetTypeName = "";
}

const loading = ref(false);

/** 标准标准规程保存提交 */
function handleSubmit() {
  formRef.value.validate(async (valid: any) => {
    if (valid) {
      loading.value = true;
      const text = formData.id ? "编辑" : "新增";
      await request({
        url: "/eam/eamsopstandard/save",
        method: "post",
        data: formData,
      }).finally(() => {
        loading.value = false;
      });
      ElMessage.success(text + `成功`);
      closeDialog();
      emit("reset-table", formData.id);
    }
  });
}

// 组件销毁时调用
onBeforeUnmount(() => {
  visibleDialog.value = false;
  emit("change-visible", false);
});

// 获取标准类型列表
const typeList = ref(<any>[]);
async function getTypeList(value: string) {
  const params = {
    taskKind: props.taskKind,
    assetKind: props.assetKind,
  };
  typeList.value = (await getStandardTypesApi(params)) ?? [];
}

// 获取标准类型列表
const deviceList = ref(<any>[]);
const flatDeviceList = ref(<any>[]);
async function getDeviceList() {
  const params = {
    assetKind: props.assetKind,
  };
  deviceList.value = (await getStandardDevicesApi(params)) ?? [];
  flatDeviceList.value = flattenTree(deviceList.value);
}
function flattenTree(tree, result = []) {
  tree.forEach((node) => {
    result.push(node);
    if (node.nodes && node.nodes.length > 0) {
      flattenTree(node.nodes, result);
    }
  });
  return result;
}
getDeviceList();

// 图片处理
function updateFormFiles(val: []) {
  formData.images = val;
}

// 点击制造商 返回品牌和型号
const brandModelList = ref(<any>[]);
const handleMakerChange = async (e, row) => {
  if (row) {
    formData.brandId = "";
    formData.brandName = "";
    formData.modelNo = "";
    formData.assetModelId = "";
  }

  if (e) {
    brandModelList.value = [];
    const params = { makerId: e, assetKind: props.assetKind };
    brandModelList.value = (await getBrandModelListApi(params)) ?? [];
  } else {
    formData.makerId = "";
    formData.makerName = "";
    formData.makerCode = "";
    brandModelList.value = [];
  }
};

// 点击品牌 赋值
const handelBrandModelNo = (e) => {
  if (e) {
    brandModelList.value.forEach((item: any) => {
      if (item.id == e) {
        formData.assetModelId = item.id;
        formData.brandId = item.brandId;
        formData.brandName = item.brandName;
        formData.modelNo = item.modelNo;
      }
    });
  } else {
    formData.brandId = "";
    formData.brandName = "";
    formData.modelNo = "";
    formData.assetModelId = "";
  }
};

// 获取制造商列表
const makerList: any = ref([]);
const getMakerList = async () => {
  const params = {
    assetKind: props.assetKind,
  };
  makerList.value = (await getMakerListApi(params)) ?? [];
};
const sopType = ref();
onMounted(async () => {
  getMakerList();
  getLocationInfoTree();
  await getTypeList("");
  if (props.sopTypeCode) {
    sopType.value =
      typeList.value.find(
        (item: any) => item.sopTypeCode === props.sopTypeCode
      ) || "";
    formData.sopTypeId = sopType.value?.id;
  }
});

// 定义 物料选择器弹窗参数
const materialSelect = reactive<DialogOption>({
  visible: false,
  data: [],
});

const materialOptions: any = ref([]); // 选择器 list

// 打开 物料选择器弹窗
function openMaterialDialog() {
  if (formData.standardCode) {
    materialOptions.value = [
      {
        materialCode: formData.standardCode,
      },
    ];
  }
  materialSelect.visible = true;
  materialSelect.data = materialOptions.value;
}

// 接收 物料选择器回调参数
function getMaterialSelect(options: any) {
  formData.standardCode = options[0]?.materialCode || "";
}
const handleEquipTypeChange = () => {
  const find = flatDeviceList.value.find(
    (item: any) => item.id === formData.equipTypeId
  );
  formData.equipTypeName = find?.assetTypeName || "";
  genStandardCodeAndName();
};
const genStandardCodeAndName = async () => {
  if (formData.equipTypeId) {
    formData.standardName = formData.equipTypeName;
  } else {
    formData.standardName = "";
  }
};
// 获取位置信息下拉树
const locationInfoTree = ref([]);
const getLocationInfoTree = async () => {
  const { data } = await request({
    url: "/eam/locationInfo/getTree",
    method: "POST",
    data: {
      enabled: 1,
    },
  });
  locationInfoTree.value = data;
};
// 点击位置树
const changeLocation = (e) => {
  if (e) {
    formData.locationId = e.id;
    formData.locationName = e.locationName;
  } else {
    formData.locationId = "";
    formData.locationName = "";
  }
};
const handelLocation = (e) => {
  if (!e) {
    formData.locationId = "";
    formData.locationName = "";
  }
};
</script>

<style scoped lang="scss">
:deep(.maxhDialog .el-dialog__body) {
  max-height: 70vh;
  overflow-y: auto;
}
.el-form-item {
  margin-bottom: 15px;
}
:deep(.el-descriptions__label.el-descriptions__cell.is-bordered-label) {
  width: 120px;
}
:deep(.el-descriptions__content.el-descriptions__cell.is-bordered-content) {
  min-width: 180px;
}
:deep(.moldEnterInspect) {
  .el-input__inner {
    background-color: #fff !important;
  }
  .el-input__wrapper {
    background-color: #fff !important;
  }
  .el-input-group__append {
    cursor: pointer;
    padding: 0;
    > div {
      padding: 0 20px;
    }
  }
}
</style>
